<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="调度请求ID" prop="dispatchRequestsId">
        <el-input v-model="queryParams.dispatchRequestsId" placeholder="请输入调度请求ID" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="调用单位ID" prop="callingOrganizationId">
        <el-input v-model="queryParams.callingOrganizationId" placeholder="请输入调用单位ID" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="调用单位名称" prop="callingOrganizationName">
        <el-input v-model="queryParams.callingOrganizationName" placeholder="请输入调用单位名称" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="被调用单位ID" prop="calledOrganizationId">
        <el-input v-model="queryParams.calledOrganizationId" placeholder="请输入被调用单位ID" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="被调用单位名称" prop="calledOrganizationName">
        <el-input v-model="queryParams.calledOrganizationName" placeholder="请输入被调用单位名称" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="请求日期" prop="callDate">
        <el-date-picker clearable v-model="queryParams.callDate" type="date" value-format="yyyy-MM-dd"
          placeholder="请选择请求日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="归还日期" prop="returnDate">
        <el-date-picker clearable v-model="queryParams.returnDate" type="date" value-format="yyyy-MM-dd"
          placeholder="请选择归还日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="拒绝原因" prop="rejectionReason">
        <el-input v-model="queryParams.rejectionReason" placeholder="请输入拒绝原因" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="请求者ID" prop="requesterId">
        <el-input v-model="queryParams.requesterId" placeholder="请输入请求者ID" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="请求者姓名" prop="requesterName">
        <el-input v-model="queryParams.requesterName" placeholder="请输入请求者姓名" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="审批者ID" prop="approverId">
        <el-input v-model="queryParams.approverId" placeholder="请输入审批者ID" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="审批者姓名" prop="approverName">
        <el-input v-model="queryParams.approverName" placeholder="请输入审批者姓名" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
          v-hasPermi="['scheduling:requests:add']">新增</el-button>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
          v-hasPermi="['scheduling:requests:edit']">修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['scheduling:requests:remove']">删除</el-button>
      </el-col> -->
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
          v-hasPermi="['scheduling:requests:export']">导出</el-button>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button type="info" plain icon="el-icon-switch" size="mini" @click="toggleQueryMode">切换查询模式</el-button>
      </el-col> -->
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-document" size="mini" @click="setMyRequests">我的申请</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-document-checked" size="mini" @click="setPendingRequests">待处理申请</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="requestsList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <!-- <el-table-column label="自增ID" align="center" prop="id" /> -->
      <el-table-column label="调度请求ID" align="center" prop="dispatchRequestsId" />
      <!-- <el-table-column label="调用单位ID" align="center" prop="callingOrganizationId" /> -->
      <el-table-column label="调用单位名称" align="center" prop="callingOrganizationName" />
      <!-- <el-table-column label="被调用单位ID" align="center" prop="calledOrganizationId" /> -->
      <el-table-column label="被调用单位名称" align="center" prop="calledOrganizationName" />
      <el-table-column label="请求日期" align="center" prop="callDate" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.callDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="归还日期" align="center" prop="returnDate" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.returnDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <!-- <el-table-column label="调度请求状态" align="center" prop="dispatchRequestsStatus" /> -->
      <el-table-column label="调度请求状态" align="center" prop="dispatchRequestsStatus">
        <template slot-scope="scope">
          <span>{{ statusMap[scope.row.dispatchRequestsStatus] }}</span>
        </template>
      </el-table-column>
      <el-table-column label="拒绝原因" align="center" prop="rejectionReason" />
      <!-- <el-table-column label="请求者ID" align="center" prop="requesterId" /> -->
      <el-table-column label="请求者姓名" align="center" prop="requesterName" />
      <!-- <el-table-column label="审批者ID" align="center" prop="approverId" /> -->
      <el-table-column label="审批者姓名" align="center" prop="approverName" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleQueryDetails(scope.row)"
            v-hasPermi="['scheduling:requests:query']">查看请求详情</el-button>
          <p v-if="scope.row.dispatchRequestsStatus >= 3"><el-button size="mini" type="text" icon="el-icon-edit"
              @click="handleExecutionsDetails(scope.row)"
              v-hasPermi="['scheduling:executions:query']">查看执行详情</el-button></p>
          <!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="handleQuery(scope.row)"
            v-hasPermi="['scheduling:requests:query']">查看执行详情</el-button> -->
          <p v-if="scope.row.dispatchRequestsStatus === 0 && queryMode !== 'outbound'">
            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleDelete(scope.row)"
              v-hasPermi="['scheduling:requests:remove']">通过</el-button>
            <el-button size="mini" type="text" icon="el-icon-delete" @click="openRejectDialog(scope.row)"
              v-hasPermi="['scheduling:requests:edit']">拒绝</el-button>
          </p>
          <p v-if="scope.row.dispatchRequestsStatus === 1 && queryMode !== 'inbound'">
            <el-button size="mini" type="text" icon="el-icon-car" @click="handleTakeVehicle(scope.row)"
              v-hasPermi="['scheduling:executions:add']">取车</el-button>
          </p>
          <p v-if="scope.row.dispatchRequestsStatus === 3 && queryMode !== 'inbound'">
            <el-button size="mini" type="text" icon="el-icon-back" @click="handleReturnVehicle(scope.row)"
              v-hasPermi="['scheduling:executions:remove']">还车</el-button>
          </p>
          <!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['scheduling:requests:edit']">拒绝</el-button> -->
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改调度请求对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="选择单位" prop="deptId">
          <el-select v-model="form.deptId" placeholder="请选择单位" @change="handleDeptChange">
            <el-option v-for="dept in deptOptions" :key="dept.deptId" :label="dept.deptName" :value="dept.deptId" />
          </el-select>
        </el-form-item>
        <el-form-item label="选择车辆" prop="vehicleId">
          <el-select v-model="form.vehicleId" multiple placeholder="请选择车辆">
            <el-option v-for="vehicle in vehicleList" :key="vehicle.id"
              :label="`${vehicle.brand} ${vehicle.licensePlate} ${vehicle.type} ${vehicle.seatCount}座`"
              :value="vehicle.id">
              <span style="float: left">{{ vehicle.brand }} {{ vehicle.licensePlate }} {{ vehicle.type }} {{
                vehicle.seatCount }}座</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="请求日期" prop="callDate">
          <el-date-picker clearable v-model="form.callDate" type="date" value-format="yyyy-MM-dd" placeholder="请选择请求日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="归还日期" prop="returnDate">
          <el-date-picker clearable v-model="form.returnDate" type="date" value-format="yyyy-MM-dd"
            placeholder="请选择归还日期">
          </el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 添加审批 -->
    <el-dialog title="拒绝原因" :visible.sync="rejectDialogVisible" width="30%">
      <el-form :model="rejectForm" label-width="80px">
        <el-form-item label="原因">
          <el-input type="textarea" v-model="rejectForm.rejectionReason" placeholder="请输入拒绝原因" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="rejectDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitRejection">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 详情对话框 -->
    <el-dialog title="请求详情" :visible.sync="detailDialogVisible" width="60%">
      <el-form :model="detailData" label-width="120px" label-position="left">
        <el-form-item label="调度请求ID">
          <span>{{ detailData.dispatchRequestsId }}</span>
        </el-form-item>
        <!-- <el-form-item label="调用单位ID">
          <span>{{ detailData.callingOrganizationId }}</span>
        </el-form-item> -->
        <el-form-item label="调用单位名称">
          <span>{{ detailData.callingOrganizationName }}</span>
        </el-form-item>
        <!-- <el-form-item label="被调用单位ID">
          <span>{{ detailData.calledOrganizationId }}</span>
        </el-form-item> -->
        <el-form-item label="被调用单位名称">
          <span>{{ detailData.calledOrganizationName }}</span>
        </el-form-item>
        <el-form-item label="请求日期">
          <span>{{ parseTime(detailData.callDate, '{y}-{m}-{d}') }}</span>
        </el-form-item>
        <el-form-item label="归还日期">
          <span>{{ parseTime(detailData.returnDate, '{y}-{m}-{d}') }}</span>
        </el-form-item>
        <el-form-item label="调度请求状态">
          <span>{{ detailData.dispatchRequestsStatus }}</span>
        </el-form-item>
        <el-form-item label="拒绝原因">
          <span>{{ detailData.rejectionReason }}</span>
        </el-form-item>
        <el-form-item label="请求者ID">
          <span>{{ detailData.requesterId }}</span>
        </el-form-item>
        <el-form-item label="请求者姓名">
          <span>{{ detailData.requesterName }}</span>
        </el-form-item>
        <el-form-item label="审批者ID">
          <span>{{ detailData.approverId }}</span>
        </el-form-item>
        <el-form-item label="审批者姓名">
          <span>{{ detailData.approverName }}</span>
        </el-form-item>
        <el-form-item label="车辆信息">
          <el-table :data="detailData.sysVechicleDto" border style="width: 100%">
            <el-table-column prop="id" label="车辆ID" width="100"></el-table-column>
            <el-table-column prop="licensePlate" label="车牌号" width="120"></el-table-column>
            <el-table-column prop="brand" label="品牌" width="120"></el-table-column>
            <el-table-column prop="purchaseYear" label="购买年份" width="120"></el-table-column>
            <el-table-column prop="organizationName" label="所属单位" width="120"></el-table-column>
            <el-table-column prop="status" label="状态" width="100"></el-table-column>
            <el-table-column prop="type" label="类型" width="120"></el-table-column>
            <el-table-column prop="seatCount" label="座位数" width="100"></el-table-column>
            <el-table-column prop="image" label="图片" width="150">
              <template slot-scope="scope">
                <el-image :src="scope.row.image" style="width: 100px; height: 60px;"></el-image>
              </template>
            </el-table-column>
            <el-table-column prop="driver" label="司机" width="100"></el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="detailDialogVisible = false">关闭</el-button>
      </div>
    </el-dialog>
    <!-- 执行详情对话框 -->
    <el-dialog title="执行详情" :visible.sync="executionDialogVisible" width="60%">
      <el-form :model="executionData" label-width="120px" label-position="left">
        <el-form-item label="调度请求ID">
          <span>{{ executionData.dispatchRequestsId }}</span>
        </el-form-item>
        <el-form-item label="调用单位ID">
          <span>{{ executionData.callingOrganizationId }}</span>
        </el-form-item>
        <el-form-item label="调用单位名称">
          <span>{{ executionData.callingOrganizationName }}</span>
        </el-form-item>
        <el-form-item label="被调用单位ID">
          <span>{{ executionData.calledOrganizationId }}</span>
        </el-form-item>
        <el-form-item label="被调用单位名称">
          <span>{{ executionData.calledOrganizationName }}</span>
        </el-form-item>
        <el-form-item label="实际请求时间">
          <span>{{ parseTime(executionData.actualCallTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
        </el-form-item>
        <el-form-item label="实际结束时间">
          <span>{{ parseTime(executionData.actualEndTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
        </el-form-item>
        <el-form-item label="实际位置">
          <span>{{ executionData.actualLocation }}</span>
        </el-form-item>
        <el-form-item label="车辆信息">
          <el-table :data="executionData.sysVechicleDto" border style="width: 100%">
            <el-table-column prop="id" label="车辆ID" width="100"></el-table-column>
            <el-table-column prop="licensePlate" label="车牌号" width="120"></el-table-column>
            <el-table-column prop="brand" label="品牌" width="120"></el-table-column>
            <el-table-column prop="purchaseYear" label="购买年份" width="120"></el-table-column>
            <el-table-column prop="organizationName" label="所属单位" width="120"></el-table-column>
            <el-table-column prop="status" label="状态" width="100"></el-table-column>
            <el-table-column prop="type" label="类型" width="120"></el-table-column>
            <el-table-column prop="seatCount" label="座位数" width="100"></el-table-column>
            <el-table-column prop="image" label="图片" width="150">
              <template slot-scope="scope">
                <el-image :src="scope.row.image" style="width: 100px; height: 60px;"></el-image>
              </template>
            </el-table-column>
            <el-table-column prop="driver" label="司机" width="100"></el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="executionDialogVisible = false">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listRequests, getRequests, delRequests, addRequests, updateRequests, getDeptList, handleDeptChange, rejectDispatchRequest, takeVehicle, returnVehicle, getDispatchDetails, getDispatchExecutionDetails, listInboundRequests, listOutboundRequests } from "@/api/scheduling/requests";

export default {
  name: "Requests",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 调度请求表格数据
      requestsList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        dispatchRequestsId: null,
        callingOrganizationId: null,
        callingOrganizationName: null,
        calledOrganizationId: null,
        calledOrganizationName: null,
        callDate: null,
        returnDate: null,
        dispatchRequestsStatus: null,
        rejectionReason: null,
        requesterId: null,
        requesterName: null,
        approverId: null,
        approverName: null
      },
      // 表单参数
      form: {
        vehicleId: [],
        sysVehicles: [] // 新增字段，用于存储 sysVehicles 集合
      },
      // 表单校验
      rules: {
        callingOrganizationId: [
          { required: true, message: "调用单位ID不能为空", trigger: "blur" }
        ],
        calledOrganizationId: [
          { required: true, message: "被调用单位ID不能为空", trigger: "blur" }
        ],
        vehicleId: [
          { required: true, message: "请选择车辆", trigger: "change" }
        ],
        deptId: [
          { required: true, message: "请选择单位", trigger: "change" }
        ],
        callDate: [
          { required: true, message: "请求日期不能为空", trigger: "change" }
        ],
        returnDate: [
          { required: true, message: "归还日期不能为空", trigger: "change" }
        ],
      },
      deptOptions: [],
      vehicleList: [], // 车辆列表数据
      rejectDialogVisible: false,
      rejectForm: {
        dispatchRequestsId: null,
        rejectionReason: ''
      },
      detailDialogVisible: false, //申请详情对话框
      detailData: {},
      executionDialogVisible: false,//执行详情对话框
      executionData: {},
      statusMap: {
      0: '申请待审核',
      1: '该申请已通过',
      2: '已拒绝该申请',
      3: '已提车执行中',
      4: '执行结束已还车'
      },
      queryMode: 'outbound', // 'outbound' 或 'inbound'
    };
  },
  created() {
    this.getList();
  },
  mounted() {
    this.getDeptList();
  },
  methods: {
    setMyRequests() {
      this.queryMode = 'outbound';
      this.handleQuery();
    },
    setPendingRequests() {
      this.queryMode = 'inbound';
      this.handleQuery();
    },
    // toggleQueryMode() {
    //   this.queryMode = this.queryMode === 'outbound' ? 'inbound' : 'outbound';
    //   this.handleQuery();
    // },
    handleExecutionsDetails(row) {
      const dispatchRequestsId = row.dispatchRequestsId;
      getDispatchExecutionDetails(dispatchRequestsId)
        .then((response) => {
          if (response.code === 200) {
            this.executionData = response.data;
            this.executionDialogVisible = true;
          } else {
            this.$message.error(response.msg);
          }
        })
        .catch(() => {
          this.$message.error('获取执行详情失败');
        });
    },
    handleQueryDetails(row) {
      const dispatchRequestsId = row.dispatchRequestsId;
      getDispatchDetails(dispatchRequestsId)
        .then((response) => {
          if (response.code === 200) {
            this.detailData = response.data;
            this.detailDialogVisible = true;
          } else {
            this.$message.error(response.msg);
          }
        })
        .catch(() => {
          this.$message.error('获取请求详情失败');
        });
    },
    handleReturnVehicle(row) {
      const dispatchRequestsId = row.dispatchRequestsId;
      this.$modal.confirm('是否确认还车？').then(() => {
        // 假设有一个API方法 returnVehicle
        returnVehicle(dispatchRequestsId)
          .then(() => {
            this.$modal.msgSuccess("还车成功");
            this.getList(); // 刷新列表
          })
          .catch(() => {
            this.$modal.msgError("还车失败");
          });
      }).catch(() => { });
    },
    handleTakeVehicle(row) {
      const dispatchRequestsId = row.dispatchRequestsId;
      this.$modal.confirm('是否确认取车？').then(() => {
        // 假设有一个API方法 takeVehicle
        takeVehicle(dispatchRequestsId)
          .then(() => {
            this.$modal.msgSuccess("取车成功");
            this.getList(); // 刷新列表
          })
          .catch(() => {
            this.$modal.msgError("取车失败");
          });
      }).catch(() => { });
    },
    // 打开拒绝弹窗
    openRejectDialog(row) {
      this.rejectForm.dispatchRequestsId = row.dispatchRequestsId;
      this.rejectForm.rejectionReason = '';
      this.rejectDialogVisible = true;
    },

    // 提交拒绝原因
    submitRejection() {
      const { dispatchRequestsId, rejectionReason } = this.rejectForm;
      if (!rejectionReason) {
        this.$message.warning('请输入拒绝原因');
        return;
      }

      // 调用后端接口
      rejectDispatchRequest(dispatchRequestsId, rejectionReason)
        .then(res => {
          this.$message.success('已拒绝该调度请求');
          this.rejectDialogVisible = false;
          this.getList(); // 例如刷新列表
        })
        .catch(() => {
          this.$message.error('操作失败');
        });
    },
    // 获取单位列表（若依已有接口 /system/dept/list）
    getDeptList() {
      getDeptList().then(res => {
        this.deptOptions = res.data.filter(dept => dept.parentId > 100);
      });
    },

    // 根据单位 ID 查询空闲车辆
    handleDeptChange(deptId) {
      if (!deptId) return;
      handleDeptChange(deptId).then(res => {
        this.vehicleList = res.rows || [];
        console.log(this.vehicleList);
      });
    },
    /** 查询调度请求列表 */
    getList() {
      this.loading = true;
    if (this.queryMode === 'outbound') {
      listOutboundRequests(this.queryParams).then(response => {
        this.requestsList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    } else if (this.queryMode === 'inbound') {
      listInboundRequests(this.queryParams).then(response => {
        this.requestsList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    }
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        dispatchRequestsId: null,
        callingOrganizationId: null,
        callingOrganizationName: null,
        calledOrganizationId: null,
        calledOrganizationName: null,
        callDate: null,
        returnDate: null,
        dispatchRequestsStatus: null,
        rejectionReason: null,
        requesterId: null,
        requesterName: null,
        approverId: null,
        approverName: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    // handleQuery() {
    //   this.queryParams.pageNum = 1;
    //   this.getList();
    // },
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加调度请求";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getRequests(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改调度请求";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          // 将选择单位的 id 和 name 赋值给 calledOrganizationId 和 calledOrganizationName
          const selectedDept = this.deptOptions.find(dept => dept.deptId === this.form.deptId);
          if (selectedDept) {
            this.form.calledOrganizationId = selectedDept.deptId;
            this.form.calledOrganizationName = selectedDept.deptName;
          }

          // 将 vehicleId 转换为 sysVehicles 集合，包含 id、licensePlate 和 status
          this.form.sysVehicles = this.form.vehicleId.map(id => {
            const vehicle = this.vehicleList.find(v => v.id === id);
            return {
              id: vehicle.id,
              licensePlate: vehicle.licensePlate,
              status: vehicle.status
            };
          });

          if (this.form.id != null) {
            updateRequests(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addRequests(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.dispatchRequestsId;
      this.$modal.confirm('是否确认通过该请求？').then(function () {
        return delRequests(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("审批通过成功");
      }).catch(() => { });
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('scheduling/requests/export', {
        ...this.queryParams
      }, `requests_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
